<template>
	<VueEditor
	v-model="content"
	:editorToolbar="customToolbar"
	useCustomImageHandler
	@image-added="handleImageAdded">
	</VueEditor>
</template>

<script>
import { VueEditor } from 'vue2-editor'
import { post } from '@/plugins/axios'
export default {
	name: 'LxlEditor',
	props: {
		value: {
			required: true
		}
	},
	watch: {
		content: {
			handler (newval) {
				this.$emit('input', newval)
			}
		},
	},
	created () {
		this.content = this.value
	},
	components: {
		VueEditor
	},
	data () {
		return {
			content: '',
			customToolbar: [
			        ["bold", "italic", "underline"],
			        [{ list: "ordered" }, { list: "bullet" }],
			        ["image", "code-block"]
			      ]
		}
	},
	methods: {
		//自定义上传图片的方式
		handleImageAdded (file, Editor, cursorLocation, resetUploader){
			post('/pmsFile/upload', { file:file, bucket: 'image' },response=>{
				Editor.insertEmbed(cursorLocation, "image", this.imgpath(response));
				resetUploader()
			})
		}
	}
}
</script>

<style>
</style>
